<?php require_once 'header.php'; ?>
<script type="text/javascript" src="<?=base_url()?>js/tinymce/tinymce.min.js"></script>
<script>
tinymce.init({
    selector: "#topic_news_desc",
    theme: "modern",
    width: 550,
    height: 300,
    plugins: [
         "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
         "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
         "save table contextmenu directionality emoticons template paste textcolor"
   ],
   content_css: "css/content.css",
   toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l      ink image | print preview media fullpage | forecolor backcolor emoticons", 
   style_formats: [
        {title: 'Bold text', inline: 'b'},
        {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
        {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
        {title: 'Example 1', inline: 'span', classes: 'example1'},
        {title: 'Example 2', inline: 'span', classes: 'example2'},
        {title: 'Table styles'},
        {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
    ]
 }); 
tinymce.init({
    selector: "#topic_news_content",
    theme: "modern",
    width: 550,
    height: 300,
    plugins: [
         "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
         "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
         "save table contextmenu directionality emoticons template paste textcolor"
   ],
   content_css: "css/content.css",
   toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l      ink image | print preview media fullpage | forecolor backcolor emoticons", 
   style_formats: [
        {title: 'Bold text', inline: 'b'},
        {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
        {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
        {title: 'Example 1', inline: 'span', classes: 'example1'},
        {title: 'Example 2', inline: 'span', classes: 'example2'},
        {title: 'Table styles'},
        {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
    ]
 }); 
</script>
<link rel="stylesheet" href="<?= base_url() ?>styles/datepicker/themes/base/jquery.ui.all.css" type="text/css" media="screen" charset="utf-8" />
<script src="<?php echo base_url() ?>styles/datepicker/ui/jquery.ui.core.js"></script>
<script src="<?php echo base_url() ?>styles/datepicker/ui/jquery.ui.widget.js"></script>
<script src="<?php echo base_url() ?>styles/datepicker/ui/jquery.ui.datepicker.js"></script>

<div id="content" class="col-lg-9 clearfix">
    <script type="text/javascript">
        function setError(fieldname) {
            $("." + fieldname + "class").addClass("field-error");
        }	
        function validate()
        {
            var next = true;
            if(document.upload_form.topic_news_title.value == "") {
                setError("topic_news_title");
                next = false;
            }
            if(document.upload_form.topic_news_type.value == "") {
                setError("topic_news_type");
                next = false;
            } 
            if(document.upload_form.category_id.value == "all") {
                setError("category_id");
                next = false;
            } 
	       if(document.upload_form.topic_news_number.value == "") {
                setError("topic_news_number");
                next = false;
            }
            if(document.upload_form.topic_news_tag.value == "") {
                setError("topic_news_tag");
                next = false;
            } 
            if(document.upload_form.topic_news_date.value == "") {
                setError("topic_news_date");
                next = false;
            } 
            if(document.upload_form.topic_news_author.value == "") {
                setError("topic_news_author");
                next = false;
            } 
            if(next) return true;
            else { alert("Vui lòng nhập đủ thông tin"); return false;}
        }
        $(document).ready(function() {
            $("#category_id").change(function(){
                var cate_id = $('#category_id').val();
                $.ajax({
                    type: "POST",
                    data: "category_id=" + cate_id,
                    url: "<?php echo site_url('topic/listSubByCate')?>",
                    success: function(response) {
                        $("#list_subcate").html(response);
                    } 
                });
            });
        });
    </script>
    <?php if (isset($error)): ?>
        <p class="error"><?= $error ?></p>
    <?php endif; ?>	
    <?php if (isset($success)): ?>
        <p class="success"><?= $success ?></p>
    <?php endif; ?>	
    <h2>Thêm mới topic</h2>		
    <form name="upload_form" method="post" action="<?php echo site_url('topic/add/'); ?>" enctype="multipart/form-data">
        <div style="float:left;width:500px;">
            <table align="center">
                <tr>
                    <td><h6 class="topic_news_titleclass">Topic Title</h6></td>
                    <td><input type="text" name="topic_news_title" size="40" /></td>
                </tr>
                <tr>
                    <td><h6 class="categoryclass">Category</h6></td>
                    <td>
                    	<select name="category_id" id="category_id">
                            <option value="all">All</option>
			                <?php foreach ($categorys as $category): ?>
	                            <option value="<?= $category->category_id ?>">
	                            <?= $category->category_name ?>
	                            </option>
	                    	<?php endforeach; ?>
			            </select>
		        	</td>
                </tr>
                <tr>
                    <td><h6 class="sub_categoryclass">Sub Category</h6></td>
                    <td id="list_subcate">
		        	</td>
                </tr>
                <tr>
                    <td><h6 class="topic_news_linksclass">Topic link</h6></td>
                    <td>
                       <input type="text" name="topic_news_links"/>
                    </td>
                </tr> 
                <tr>
                    <td><h6 class="topic_news_typeclass">Topic type</h6></td>
                    <td>
                       <select name="topic_news_type" style="width: 280px;">
                            <option value="default">Default</option>
                            <option value="video">Video</option>
                            <option value="picture">Picture</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td><h6 class="topic_news_numberclass">Topic number</h6></td>
                    <td>
                       <input type="text" name="topic_news_number"/>
                    </td>
                </tr>   
                <tr>
                    <td><h6 class="topic_news_pictuerclass">Upload ảnh đại diện</h6></td>
                    <td><input type="file" name="topic_news_picture" size="30" /></td>
                </tr>   
                <tr>
                    <td><h6>Danh sách ảnh (View trong trang chi tiết bài viết)</h6></td>
                    <td>
                        <input type="file" name="images[]" multiple="multiple" />  
                    </td>
                </tr>
                <tr>
                	<td><h6 class="topic_news_descclass">Mô tả ngắn</h6></td>
                    <td><textarea name="topic_news_desc" id="topic_news_desc" rows="20" cols="38"></textarea></td>
                </tr> 
                <tr>
                	<td><h6 class="topic_news_contentclass">Nội dung (Chèn ảnh lấy từ danh sách ảnh link dạng :<?=base_url().'uploads/topics/' . date('mY', microtime(true)) . '/tên_ảnh'?>)</h6></td>
                    <td><textarea name="topic_news_content" id="topic_news_content" rows="20" cols="38"></textarea></td>
                </tr>  
                <tr>
                	<td><h6 class="topic_news_tagclass">Tag bài viết</h6></td>
                    <td><textarea name="topic_news_tag" rows="10" cols="38"></textarea></td>
                </tr>  
                <!-- <tr>
                    <td><h6 class="topic_news_dateclass">Ngày đăng</h6></td>
                    <td>
                        <input type="file" name="images[]" multiple="multiple" />  
                    </td>
                </tr>    -->
                <tr>
                	<td><h6 >Link Youtube topic video</h6><br/>
                		<label><span style="color:red">Chú ý copy link trên thanh địa chỉ : </span>vd : http://www.youtube.com/watch?v=ccvHEbXhg2g</label>
                	</td>
                    <td> <input type='text' name='topic_news_video' id='youtube' size='10' style="margin-left:13px;width: 572px;"/>
                    </td>
                </tr>
                <tr>
                    <td><h6 class="topic_news_authorclass">Tác giả , Nguồn bài đăng</h6></td>
                    <td><textarea name="topic_news_author" rows="10" cols="38"></textarea></td>
                </tr>	
                <tr>
                    <td><h6>Publish<h6></td>
                    <td>
                    <select name="topic_news_status" style="width: 280px;">
                        <option value="1">Publish</option>
                        <option value="0">Unpublish</option>
                    </select>
                    </td>
                </tr>
                <tr>
                    <td><h6>Thuộc top<h6></td>
                    <td>
                    <select name="top" style="width: 280px;">
                        <option value="hot">Hot</option>
                        <option value="new">New</option>
                        <option value="trực tiếp">Trực tiếp</option>
                        <option value="cập nhật">Cập nhật</option>
                    </select>
                    </td>
                </tr>
                <tr>
                    <td><h6>Action</h6></td>
                    <td>
                        <input type="reset" value="Reset"/>
                        <input type="submit" value="Thêm mới" name="add" onclick="return validate();" />
                    </td>
                </tr>		
            </table>
        </div>
        <script>
                // $(function(){
                //     $("#date_datepicker").datepicker();
                // });
        </script>
    </form>
</div>
<?php require_once 'footer.php'; ?>